<template>
	<view class="ys">
		<view class="info">
			<view class="infoli">
				<view class="left">
					账号
				</view>
				<view class="right">
					<input type="text" v-model="username" placeholder="请输入账号">
				</view>
			</view>
			<view class="infoli">
				<view class="left">
					姓名
				</view>
				<view class="right">
					<input type="text" v-model="name" placeholder="请输入姓名">
				</view>
			</view>
			<view class="infoli">
				<view class="left">
					手机号
				</view>
				<view class="right">
					<input type="text" v-model="phone" placeholder="请输入手机号">
				</view>
			</view>
			<view class="infoli">
				<view class="left">
					推荐码
				</view>
				<view class="right">
					<input type="text" v-model="recommend" placeholder="请输入推荐码	">
				</view>
			</view>
			<view class="infoli">
				<view class="left">
					支付密码
				</view>
				<view class="right">
					<input type="password" v-model="password_pay" placeholder="请输入支付密码">
				</view>
			</view>
			<button @click="setInfo">确认</button>
		</view>
	</view>
</template>

<script>
	import {
		getUserInfo,
		register
	} from "@/api/api.js"
	export default {
		data() {
			return {
				domain: this.$config.websiteUrl,
				username: '',
				name: '',
				phone: '',
				recommend: '',
				password_pay: '',
				openid: ''
			}
		},
		onLoad(e) {
			if (e.openid) {
				this.openid = e.openid
				this.phone = e.phone
			}
		},
		methods: {
			setInfo() {
				register({
					username: this.username,
					name: this.name,
					phone: this.phone,
					password_pay: this.password_pay,
					code: this.recommend,
					type: 1,
					shop_code: '',
					openid: this.openid
				}).then(res => {
					uni.$showMsg(res.message)
					if (res.status == 1) {
						uni.setStorageSync('token', res.data)
						setTimeout(() => {
							uni.navigateBack()
						}, 500)
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #f2f2f2;
		padding-top: 15px;
		padding-bottom: 10px;
	}

	.info {
		width: 96%;
		margin: 0px auto;
		background: #fff;
		border-radius: 8px;
		box-sizing: border-box;
		padding: 10px;

		button {
			width: 96%;
			height: 41px;
			border-radius: 20px;
			line-height: 41px;
			text-align: center;
			font-size: 15px;
			color: #fff;
			background: linear-gradient(0deg, #2573e8, #6ba9fc);
			margin: 0 auto;
			margin-top: 20px;
		}

		.infoli {
			display: flex;
			font-size: 14px;
			border-bottom: 1px solid #eee;
			padding: 18px 0;

			.left {
				width: 100px;
				font-size: 15px;
				font-weight: bold;
				margin-right: 10px;
			}

			.right {
				flex: 1;

				image {
					width: 30%
				}

				input {
					font-size: 14px;
				}
			}
		}
	}
</style>